<script setup>
import { ref } from 'vue'

defineProps({
  msg: {
    type: String,
    required: true
  },
  data: {
    type: Object,
    required: false,
    default (){
        return {id:1, title: '气动固定式球阀Q647F',image: '/src/assets/WX20240324-021156@2x%201.png'}
    }
  }
})



const count = ref(0)
</script>

<template>
    <div class="w-full mb-[63px] relative card flex items-center overflow-hidden mobile:p-0 mobile:py-4 mobile:my-0 mobile:border-b-2 mobile:border-undercolor">
        <div class="w-auto h-full flex-auto border-b-2 border-undercolor flex items-center mobile:border-b-0">
          <div class="w-[300px] inline-block flex leading-none mobile:hidden">
              <span class="text-[64px] text-underint mobile:text-xl mobile:block">30/</span><span class="text-2xl text-gray2 px-2 mobile:text-xs">2024<br>07</span>
          </div>
          <div class="w-full py-6  title flex-auto mobile:py-0">
              <h3 class="pb-6 text-[32px] font-bold mobile:pb-2 mobile:text-base"><a href="">{{ data.title }}</a></h3>
              <p class="text-2xl line-clamp-2 text-gray2 mobile:line-clamp-1 mobile:text-xs"><a href="">{{ data.infor }}</a></p>
              <p class="ilmobile:hidden text-gray2 pt-2 text-xs">2024-07-30</p>
          </div>
        </div>
        <div class="w-[400px] h-[225px] ml-[80px] relative block rounded-3xl mobile:rounded-lg overflow-hidden flex-none mobile:w-[114px] mobile:ml-2 mobile:h-16" >
            <a href=""><img class="wen-icon" :src="data.image" /></a>
        </div>
    </div>
</template>

<style scoped>
</style>
